<template>
	<view class="content" style="background-color: #fff;">
		<u-navbar scrollable=false titleStyle="font-size:40rpx;color:#333" :placeholder='true' title="开具发票"
			:autoBack="true">
			<view class="u-nav-slot" @click="show = true" slot="right">
				删除

			</view>
		</u-navbar>

		<view class="container">
			<view class="li">
				<text>发票抬头</text><input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;00"
					v-model="receipt_title" placeholder="抬头名称"></input>
			</view>
			<view class="li">
				<text>税号</text><input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;00"
					v-model="duty_paragraph" placeholder="纳税人识别号或社会统一征信代码"></input>
			</view>
			<view class="li">
				<text>开户银行</text><input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;00"
					v-model="bank_name" placeholder="填写需要开具发票的姓名"></input>
			</view>
			<view class="li">
				<text>银行账号</text><input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;00"
					v-model="bank_code" placeholder="选填"></input>
			</view>
			<view class="li">
				<text>企业地址</text><input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;00"
					v-model="address" placeholder="选填"></input>
			</view>
			<view class="li">
				<text>企业电话</text><input class="fontS32" style="text-align: right; height: 100%;font-weight: 400;00"
					v-model="tel" placeholder="选填"></input>
			</view>
			<view class="li">
				<text>设为默认地址:</text>
				<view class="" style="margin-top: 20rpx;">
					<u-switch activeColor="#DD2131" v-model="value" @change="change(value)"></u-switch>
				</view>
			</view>

		</view>
		<!-- 删除 -->
		<view>
			<u-modal :show="show" :title="title" close :content='content' @confirm="sure" @cancel="cancel"
				showConfirmButton showCancelButton confirmText="删除" cancelText="取消"></u-modal>

		</view>
		<view class="btn" style="position: absolute;bottom: 0;width:100%; margin;0 4%">
			<u-button :loading="loading"  @click="store" class="submit">保存</u-button>
		</view>
	</view>
</template>



<script>
import loginVue from '../../login/login.vue';
	export default {
		data() {
			return {
				loading:false,
				id: '', //修改进入的id
				show: false,
				title: '',
				content: '确定要删除吗',
				show: false,
				value: false, //滑动开关 是否默认
				receipt_type: '1', //1.普通发票
				receipt_title: '', //发票抬头
				receipt_title_type: '', //1.个人，2.企业',
				duty_paragraph: '', //税号
				bank_name: '', //开户行
				bank_code: '', //账号
				address: '', //地址
				tel: '', //电话
				radiolist1: [{
						name: '个人',
						disabled: false
					},
					{
						name: '公司',
						disabled: false
					}
				],
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				radiovalue1: '个人',
			}
		},
		methods: {
			open() {
				// console.log('open');
			},
			close() {
				this.show = false
				// console.log('close');
			},
			change(e, value) {
				console.log('change', e, value);
			},
			cancel() {
				console.log('取消');
				this.show = false
			},
			sure() {
				console.log('删除');
				this.show = false
				if(this.id){
					this.del()
				}else{
					this.$my.go('/pages/my/ticket/index')
				}
				
			},
			// 删除
			del() {
				this.$my.post('/index/user/del_receipt', {
					id: this.id
				}).then(res => {
					if(res.code==200){
						// this.$my.go('/pages/my/ticket/index')
						this.$my.toast('删除成功')
						const that=this
						setTimeout(function(){
							
							that.$my.go()
						},2000)
					}
				})
			},
			// 添加和修改
			store() {
				this.loading=true
				this.$my.post('/index/user/save_receipt', {
					id: this.id?this.id:'',
					receipt_type: this.receipt_type,
					receipt_title: this.receipt_title,
					receipt_title_type: this.receipt_title_type,
					duty_paragraph: this.duty_paragraph,
					bank_name: this.bank_name,
					bank_code: this.bank_code,
					address: this.address,
					tel: this.tel,
					is_default: Number(this.value),
				}).then(res => {
					if (res.code == 200) {
						this.$my.toast('修改成功')
						const that=this
						setTimeout(function(){
							
							that.$my.go('/pages/my/ticket/index')
						},500)
						
					}
				})
			},
			//页面初始化
			init(is_default) {
				this.$my.get('/index/user/get_receipt_info', {
					id: this.id
				}).then(res => {
					if (res.code == 200) {
						this.receipt_title = res.data.receipt_title
						this.duty_paragraph = res.data.duty_paragraph
						this.bank_name = res.data.bank_name
						this.bank_code = res.data.bank_code
						this.address = res.data.address
						this.tel = res.data.tel
						this.value = Boolean(res.data.is_default)
					}
				})
			}
		},
		// option.val未定义为新建
		onLoad(option) {
			// console.log(option.val);
			if (option.val && option) {
				this.id = option.val
				this.init(1)
			}
			//获取发票抬头1个人2公司
			this.receipt_title_type = uni.getStorageSync('receipt_title_type');
		}
	}
</script>

<style lang="scss" scoped>
	.content {

		// border: 2rpx solid #f5f5f5;
		.container {
			padding: 0 4%;

			>.li {
				height: 100rpx;
				border-bottom: 2rpx solid #f3f3f3;
				line-height: 100rpx;
				font-size: 32rpx;
				display: flex;
				justify-content: space-between;
				font-weight: bold;

				.fw4 {
					font-weight: 400;
				}
			}
		}

		.btn {
			margin-bottom: 40rpx; 
			.submit {
				width: 92%;
				background-color: #DD2131;
				border-radius: 45rpx;
				color: white;
			}
		}

	}
</style>
